<template>
  <div>
    <el-card>
      <el-button style="float: right" type="primary" @click="getBack()" size="small">
        返回
      </el-button>
     <div class="markdown-body" style="margin-top: 32px;" v-loading="loading">
       <VueMarkdown :ishljs = "true" :source="blog.content" v-highlight style="text-align: left;"></VueMarkdown>
     </div>
    </el-card>
  </div>
</template>

<script>
  import VueMarkdown from 'vue-markdown'
  import {getByIdBlog} from "@/api/blog";
  export default {
    props: ["id"],
    components: {VueMarkdown},
    data() {
      return {
        blog: {},
        loading: true
      }
    },
    created() {
      this.getBlogDetail()
    },
    methods: {
      getBlogDetail(){
        this.loading = true
        getByIdBlog(this.id).then(res =>{
          this.blog = res.data.data
          this.loading = false
        })
      },
      // 返回
      getBack() {
        this.$router.back();
      },
    }
  }
</script>

<style scoped>

</style>
